<template>
  <!-- <div class="container"> -->
  <!-- <TopCom /> -->
  <!-- 路由出口 -->
  <router-view />
  <!-- </div> -->
</template>

<script setup>
// import TopCom from '@/components/TopCom.vue'
// import CityCom from '@/components/CityCom.vue'
// import ChartCom from '@/components/ChartCom.vue'
import { RouterView } from 'vue-router'
</script>

<style lang="scss">
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
div {
  color: rgb(255 255 255);
}
.container {
  width: 100%;
  min-height: 100vh;
  background-color: rgb(0 102 138);
  z-index: 1;
  .main {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 10rem;
    padding-left: 10rem;
  }
}
  .active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    .about {
      position: absolute;
      top: 50%;
      left: 50%;
      padding: 1rem;
      width: 300px;
      height: 300px;
      transform: translate(-50%, -50%);
      color: black;
      background-color: rgb(255 255 255);
      font-size: 0.75rem;
      line-height: 1rem;
    }
  }
</style>
